<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>添加联系人/群</title>
    <link rel="stylesheet" href="/assets/layim/css/layui.css">
    <style>
        body {
            padding: 10px;
            background-color: #f8f8f8
        }
        .site-text {
            margin: 10px 20px;
            background-color: #f2f2f2;
            padding: 20px;
        }
        .find-btn-group {
            text-align: center;
            margin-top: -30px;
        }
        .find-info-avatar {
            width: 55px;
            height: 55px;
            border-radius: 4px;
            border: 3px solid #fff;
        }
        .find-info {
            background-color: #e8e8e8;
            padding: 15px;
            display: none;
            border: 1px solid #a8a8a8;
        }
        .find-tips {
            padding: 0 0 0 10px;
        }
        .prev, .addFriend, .addGroup {
            display: none;
        }
    </style>
</head>
<body>
<div class="site-text site-block">
    <div class="layui-form-item find-btn-group">
        <button class="layui-btn layui-btn-normal layui-btn-small">
            联系人
        </button>
        <button class="layui-btn layui-btn-small layui-btn-primary" style="margin-left: -5px;">
            &nbsp;&nbsp;&nbsp;群&nbsp;&nbsp;&nbsp;
        </button>
    </div>
    <form class="layui-form" action="" onsubmit="return false">
        <div class="layui-form-item find-box">
            <blockquote class="site-text layui-elem-quote find-tips">
                通过账号查找联系人
            </blockquote>
            <div>
                <input type="hidden" name="type" value="friend">
                <input type="text" name="findnum" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item find-info">
            <label class="layui-form-label" style="padding:0">
                <img class="find-info-avatar" src=""/>
            </label>
            <div class="layui-input-block">
                <ul>
                    <li class="find-info-username"></li>
                    <li class="find-info-group" style="margin-top: 3px;">
                        <select name="groupid" id="groupid">
                            <option value="">选择分组</option>
                            {% for group in groups %}
                            <option value="{{group.Id}}">{{group.Name}}</option>
                            {% endfor %}
                        </select>
                    </li>
                </ul>
            </div>
        </div>
        <div class="layui-form-item" style="text-align: right;margin-bottom: 0;">
            <button class="layui-btn layui-btn-small layui-btn-primary prev">上一步</button>
            <button class="layui-btn layui-btn-small layui-btn-primary getNext">下一步</button>
            <button class="layui-btn layui-btn-small layui-btn-normal addFriend">加为好友</button>
            <button class="layui-btn layui-btn-small layui-btn-normal addGroup">加入群</button>
        </div>
    </form>
</div>
<script src="/assets/layim/layui.js"></script>
<script src="/assets/layim/js/Find.js"></script>
</body>
</html>
